<template>
	<el-dialog v-model="control.visible" :z-index="997" title="我的信息">
		<div class="center">
			<el-form ref="form" :model="control.form" :rules="control.rules">
				<el-form-item label="" prop="avatar">
					<div class="xp-avatar"><xc-el-upload v-model="control.form.avatar" :limit="1"></xc-el-upload></div>
				</el-form-item>
				<el-form-item label="" prop="nickname">
					<el-input v-model="control.form.nickname" autocomplete="off" placeholder="请输入您的昵称" size="large" />
				</el-form-item>
				<el-button class="xp-button-submit" type="primary" @click="control_submit" size="large">保存</el-button>
			</el-form>
		</div>

	</el-dialog>
</template>
<script>
	import config from "@/config/config.js";
	import xcHttpUtils from '@/library/xcore/js/XcHttpUtils.js';
	import xcViewUtils from '@/library/xcore/js/XcViewUtils.js';
	import xcCloginUtils from '@/library/xcore/js/XcCloginUtils.js';
	import {
		xsStringUtils,
		xsDateUtils,
		xsArrayUtils
	} from 'xstack-for-javascript';

	export default {
		props: {
			modelValue: {
				type: Object,
				default: []
			},
			data: {
				type: Object,
				default: []
			},
		},
		watch: {
			'data': {
				handler(newVal, oldVal) {
					let that = this;
				},
			},
		},
		data() {
			return {
				// clogintoken:null,
				config: config,
				xsStringUtils: xsStringUtils,
				xsDateUtils: xsDateUtils,
				sp: {},
				sr: {},
				control: {
					visible: false,
					form: {
						nickname: null,
						avatar: null,
					},
					rules: {
						nickname: {
							required: true,
						},
					},
				}
			}
		},
		created() {
			let that = this;
			that.xinit();
		},
		methods: {
			xinit() {
				let that = this;
				// that.clogintoken = xcCloginUtils.getSessionToken()
			},
			public_show() {
				let that = this;
				that.control.visible = true;

				xcCloginUtils.getUserinfo(function(userinfo) {
					// that.sr.userinfo = userinfo;
					xcHttpUtils.row2form(userinfo, that.control.form);
				});
			},
			public_reset() {
				let that = this;
				that.public_show();
			},
			control_click() {
				let that = this;
				that.$emit('update:modelValue', "Hello World!");
			},
			handleAvatarSuccess(response, uploadFile) {
				let that = this;
				if (response.code == 1) {
					that.sr.userinfo.avatar = response.data.fullurl;
				} else {
					xcViewUtils.message_error(response.msg);
				}
				console.log(response, uploadFile.raw);
			},
			control_submit() {
				let that = this;
				that.$refs.form.validate().then(res => {
					xcHttpUtils.my_post_xtype("xc", 'cloginApi', "updateUserinfo", that.control.form, function(res) {
						xcViewUtils.message_success('保存成功', function() {
							that.control.visible = false;
						});
					});
				});
			}
		}
	}
</script>

<style lang="scss">
	.xp-avatar {
		width: 100%;
		text-align: center;
	}

	.xp-button-submit {
		width: 100%;
	}
</style>